<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:th="http://www.thymeleaf.org">
<head>
	<title>community_building</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<!--<meta name=viewportcontent="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui">-->
	<link rel="stylesheet"  th:href="@{plug-in/element-ui/index.css}"/>
	<link rel="stylesheet" th:href="@{plug-in/my/myStyle.css}"/>
	<script th:src="@{plug-in/vue/vue.js}"></script>
	<script th:src="@{plug-in/vue-resource/vue-resource.js}"></script>
	<script th:src="@{plug-in/element-ui/index.js}"></script>
	<script th:src="@{plug-in/hplus/js/jquery.min.js?v=2.1.4}"></script>
	<script th:src="@{plug-in/my/myutil.js}"></script>
	<script type="text/javascript" th:src="@{plug-in/lhgDialog/lhgdialog.min.js?skin=metrole}"></script>
	<script th:src="@{plug-in/tools/curdtools_zh-cn.js}"></script>
	<script th:src="@{plug-in/jquery/jquery.cookie.js}"></script>

</head>
<body style="background-color: #FFFFFF;margin: 0!important;">

	<div id="communityBuildingList" v-cloak>
		<el-container>
			<el-aside width="200px">
				<el-tree
						:props="defaultProps"
						:load="loadChildrenNode"
						lazy
						:default-expanded-keys="default_expended_key"
						highlight-current
						node-key="id"
						ref="tree"
						accordion
						@node-click="handleNodeClick">
				</el-tree>
			</el-aside>
			<el-main id="el-main">
                <div id="unit_div" style="display:none;height: 100%" th:include="zhgl/building/buildingUnitList :: #buildingUnitList"></div>
                <div id="house_div" style="display:none;height: 100%" th:include="zhgl/building/unitHouseList :: #unitHouseList"></div>
                <div id="building_div">
                    <!--工具条-->
                    <div name="searchColums" id="searchColums">
                        <el-form :inline="true" :model="filters" size="small" ref="filters" class="searchForm">
                            <el-form-item class="el-form-item" label="楼名称">
                                <el-input v-model="filters.buildingName" name="buildingName" auto-complete="off" placeholder="请输入楼名称"></el-input>
                            </el-form-item>
                            <el-form-item class="el-form-item" label="楼类型">
                                <el-input v-model="filters.buildingType" auto-complete="off" placeholder="请输入楼类型"></el-input>
                            </el-form-item>
                            <el-form-item class="el-form-item" label="产权">
                                <el-select size="small" v-model="filters.propertyRight" clearable placeholder="请选择" >
                                    <el-option v-for="item in propertyRightOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>

                            <span class="bth_search">
					<el-form-item>
			    		<el-button type="success" icon="el-icon-search" v-on:click="getCommunityBuildings">查询</el-button>
			    	</el-form-item>
			    	<el-form-item>
			    		<el-button icon="el-icon-refresh" @click="resetForm('filters')">重置</el-button>
			    	</el-form-item>
				</span>
                        </el-form>
                    </div>
                    <!--toolbar-->
                    <el-row id="toolbar">
                        <el-col :span="24">
                            <div class="grid-content bg-purple-light">
                                <el-button type="primary" size="mini" icon="el-icon-edit" @click="handleAdd">新增</el-button>
                                <el-button type="primary" size="mini" @click="batchRemove" :disabled="this.sels.length===0" icon="el-icon-delete">批量删除</el-button>
                                <el-button type="primary" size="mini" @click="templeteDown"  icon="el-icon-download">模板下载</el-button>
                                <el-button type="primary" size="mini" @click="templeteUp"  icon="el-icon-upload">导入</el-button>
                            </div>
                        </el-col>
                    </el-row>

                    <!--列表-->
                    <el-table :data="communityBuildings" id="datagrid" empty-text=" " height="250" border stripe size="mini" :header-row-class-name="headStyle" highlight-current-row v-loading="listLoading" :row-class-name="tableRowClassName" @sort-change="handleSortChange"  @selection-change="selsChange" style="width: 100%;">
                        <el-table-column type="selection" width="45"></el-table-column>
                        <el-table-column prop="index" :formatter="index_formatter" label="序号" width="60"></el-table-column>
                        <el-table-column prop="communityName"  label="所属小区" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column prop="buildingName" label="楼名称" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column prop="buildingType" label="楼类型" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column prop="manager" label="负责人" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column prop="size" label="面积" width="120" show-overflow-tooltip></el-table-column>
                        <el-table-column prop="floorNumber" label="楼层数" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column prop="position" label="楼位置" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column prop="completeDate" label="竣工时间" width="120"  show-overflow-tooltip :formatter="formatDate"></el-table-column>
                        <el-table-column prop="developer" label="开发商" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column prop="developerPhone" label="开发商电话" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column prop="cleaningUser" label="保洁ID" width="120" show-overflow-tooltip></el-table-column>
                        <el-table-column prop="propertyRight" label="产权" width="120" show-overflow-tooltip></el-table-column>
                        <el-table-column prop="propertyRightName" label="产权" width="120" show-overflow-tooltip></el-table-column>
                        <el-table-column prop="houseNumber" label="户数" width="120"  show-overflow-tooltip></el-table-column>
                        <el-table-column label="操作" width="160" fixed="right">
                            <template scope="scope">
                                <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
                                <el-button type="danger" size="mini" @click="handleDel(scope.$index, scope.row)">删除</el-button>
                            </template>
                        </el-table-column>
                    </el-table>

                    <!--工具条-->
                    <el-col :span="24" class="toolbar" id="pageDiv">
                        <el-pagination small background @current-change="handleCurrentChange" @size-change="handleSizeChange" :page-sizes="[10, 20, 50, 100]"
                                       :page-size="pageSize" :total="total" layout="total,sizes, prev, pager, next"  style="float:right;"></el-pagination>
                    </el-col>

                    <!--编辑界面-->
                    <el-dialog title="编辑"  :visible.sync="editFormVisible" :close-on-click-modal="false">
                        <el-form :model="addForm" label-width="80px" :rules="addFormRules" ref="addForm" size="mini">
                            <el-col :span="12">
                                <el-form-item label="楼名称" prop="buildingName">
                                    <el-input v-model="addForm.buildingName" auto-complete="off" placeholder="请输入楼名称"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="楼类型" prop="buildingType">
                                    <el-input v-model="addForm.buildingType" auto-complete="off" placeholder="请输入楼类型"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="负责人" prop="manager">
                                    <el-input v-model="addForm.manager" auto-complete="off" placeholder="请输入负责人"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="面积" prop="size">
                                    <el-input v-model="addForm.size" auto-complete="off" placeholder="请输入面积"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="楼层数" prop="floorNumber">
                                    <el-input v-model="addForm.floorNumber" auto-complete="off" placeholder="请输入楼层数"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="楼位置" prop="position">
                                    <el-input v-model="addForm.position" auto-complete="off" placeholder="请输入楼位置"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="竣工时间">
                                    <el-date-picker type="date" placeholder="选择竣工时间" v-model="addForm.completeDate"></el-date-picker>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="开发商" prop="developer">
                                    <el-input v-model="addForm.developer" auto-complete="off" placeholder="请输入开发商"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="开发商电话" prop="developerPhone">
                                    <el-input v-model="addForm.developerPhone" auto-complete="off" placeholder="请输入开发商电话"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="保洁ID" prop="cleaningUser">
                                    <el-input v-model="addForm.cleaningUser" auto-complete="off" placeholder="请输入保洁ID"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="产权" prop="propertyRight">
                                    <el-input v-model="addForm.propertyRight" auto-complete="off" placeholder="请输入产权"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="户数" prop="houseNumber">
                                    <el-input v-model="addForm.houseNumber" auto-complete="off" placeholder="请输入户数"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="单元" prop="existUnit">
                                    <el-radio-group v-model="addForm.existUnit">
                                        <el-radio label="1">存在</el-radio>
                                        <el-radio label="0">不存在</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-col>
                        </el-form>
                        <div slot="footer" class="dialog-footer">
                            <el-button @click.native="editFormVisible = false">取消</el-button>
                            <el-button type="primary" @click.native="editSubmit" :loading="editLoading">提交</el-button>
                        </div>
                    </el-dialog>

                    <!--新增界面-->
                    <el-dialog title="新增"  :visible.sync="addFormVisible" :close-on-click-modal="false">
                        <el-form :model="addForm" label-width="80px" :rules="addFormRules" ref="addForm" size="mini">
                            <el-input v-model="addForm.communityId" type="hidden" style="display: none!important;"></el-input>

                            <el-col :span="12">
                                <el-form-item label="楼名称" prop="buildingName">
                                    <el-input v-model="addForm.buildingName" auto-complete="off" placeholder="请输入楼名称"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="楼类型" prop="buildingType">
                                    <el-input v-model="addForm.buildingType" auto-complete="off" placeholder="请输入楼类型"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="负责人" prop="manager">
                                    <el-input v-model="addForm.manager" auto-complete="off" placeholder="请输入负责人"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="面积" prop="size">
                                    <el-input v-model="addForm.size" auto-complete="off" placeholder="请输入面积"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="楼层数" prop="floorNumber">
                                    <el-input v-model="addForm.floorNumber" auto-complete="off" placeholder="请输入楼层数"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="楼位置" prop="position">
                                    <el-input v-model="addForm.position" auto-complete="off" placeholder="请输入楼位置"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="竣工时间">
                                    <el-date-picker type="date" placeholder="选择竣工时间"  v-model="addForm.completeDate"></el-date-picker>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="开发商" prop="developer">
                                    <el-input v-model="addForm.developer" auto-complete="off" placeholder="请输入开发商"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="开发商电话" prop="developerPhone">
                                    <el-input v-model="addForm.developerPhone" auto-complete="off" placeholder="请输入开发商电话"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="保洁ID" prop="cleaningUser">
                                    <el-input v-model="addForm.cleaningUser" auto-complete="off" placeholder="请输入保洁ID"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="产权" prop="propertyRight">
                                    <el-input v-model="addForm.propertyRight" auto-complete="off" placeholder="请输入产权"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="户数" prop="houseNumber">
                                    <el-input v-model="addForm.houseNumber" auto-complete="off" placeholder="请输入户数"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="单元" prop="existUnit">
                                    <el-radio-group v-model="addForm.existUnit">
                                        <el-radio label="1">存在</el-radio>
                                        <el-radio label="0">不存在</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-col>
                        </el-form>
                        <div slot="footer" class="dialog-footer">
                            <el-button @click.native="addFormVisible = false">取消</el-button>
                            <el-button type="primary" @click.native="addSubmit" :loading="addLoading">提交</el-button>
                        </div>
                    </el-dialog>
                    <!--导入界面-->
                    <el-dialog title="导入"  :visible.sync="importFormVisible" :close-on-click-modal="false">
                        <el-upload
                                class="upload-demo"
                                ref="upload"
                                accept="xls,xlsx"
                                action="communityBuilding?upload"
                                :on-preview="handlePreview"
                                :on-remove="handleRemove"
                                :on-success="handleSuccess"
                                :before-upload="beforeAvatarUpload"
                                :file-list="fileList"
                                :data="uploadParams"
                                :auto-upload="false">
                            <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
                            <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传</el-button>
                            <div slot="tip" class="el-upload__tip">只能上传xls/xlsx文件</div>
                        </el-upload>
                    </el-dialog>
                </div>

			</el-main>
		</el-container>

	</div>
</body>
<script>
	var defaultNode="";

    var vue = new Vue({
        el:"#communityBuildingList",
        data() {
            return {
                filters: {
                    buildingName:'',
                    buildingType:'',
                },
                //单元过滤条件
                unitFilters: {
                    unitName:''
                },
                houseFilters:{
                    houseName:''
                },
                url:{
                    list:'communityBuilding/page',
                    del:'communityBuilding?doDel',
                    batchDel:'communityBuilding?doBatchDel',
                    queryDict:'systemController.do?typeListJson',
                    save:'communityBuilding?doAdd',
                    edit:'communityBuilding?doUpdate',
                    //单元数据
                    unitList:"buildingUnit/page",
                    unitDel:'buildingUnit?doDel',
                    unitBatchDel:'buildingUnit?doBatchDel',
                    unitSave:'buildingUnit?doAdd',
                    unitEdit:'buildingUnit?doUpdate',
                    //房屋数据
                    houseList:"unitHouse/page",
                    houseDel:'unitHouse?doDel',
                    houseBatchDel:'unitHouse?doBatchDel',
                    houseSave:'unitHouse?doAdd',
                    houseEdit:'unitHouse?doUpdate'
                },
                communityBuildings: [],
                buildingUnitDatas:[],
                unitHouseDatas:[],
                default_expended_key:[],
                fileList:[],
                fileListHouse:[],
                total: 0,
                page: 1,
                pageSize:10,
                sort:{
                    sort:'id',
                    order:'desc'
                },
                unitsort:{
                    sort:'id',
                    order:'desc'
                },
                unittotal: 0,
                unitpage: 1,
                unitpageSize:10,
                //房屋列表数据
                housesort:{
                    sort:'id',
                    order:'desc'
                },
                housetotal: 0,
                housepage: 1,
                housepageSize:10,

                listLoading: false,
                listunitLoading:false,
                listhouseLoading:false,
                sels: [],//列表选中列
                unitSels:[],
                houseSels:[],
                uploadParams:{},
                uploadParamsHouse:{},

                editFormVisible: false,//编辑界面是否显示
                editHouseFormVisible: false,

				importFormVisible:false,
                importHouseFormVisible:false,
                editLoading: false,
                editUnitLoading: false,
                editHouseLoading: false,

                addFormVisible: false,//新增界面是否显示
                addLoading: false,
                addUnitLoading:false,
                addHouseLoading:false,
                addFormRules: {
                },
                //新增界面数据
                addForm: {},

                formFile: {
                },
                buildingTreeData:[],
                defaultProps: {
                    children: 'children',
                    label: 'name'
                },
                //数据字典
                propertyRightOptions:[],
                //单元
                addUnitFormVisible: false,
                addUnitFormRules: {
                },
                addHouseFormVisible: false,
                addHouseFormRules: {
                },
                //新增界面数据
                addUnitForm: {},
                addHouseForm: {},
                editUnitFormVisible: false,
                //新增界面数据
                editUnitForm: {},
                editHouseForm: {}
            }
        },
        http: {
            headers: {
                'Authorization' : "Bearer "+$.cookie(getToken())
            }
        },
        methods: {
            handleSortChange(sort){
                this.sort={
                    sort:sort.prop,
                    order:sort.order=='ascending'?'asc':'desc'
                };
                this.getCommunityBuildings();
            },
            handleUnitSortChange(sort){
                this.unitsort={
                    sort:sort.prop,
                    order:sort.order=='ascending'?'asc':'desc'
                };
                this.getBuildingUnit();
            },
            handleHouseSortChange(sort){
                this.housesort={
                    sort:sort.prop,
                    order:sort.order=='ascending'?'asc':'desc'
                };
                this.getUnitHouse();
            },

            handleDownFile(type,filePath){
                var downUrl=this.url.downFile+"?down="+type+"&dbPath="+filePath;
                window.open(downUrl);
            },
            tableRowClassName(row, index) {
                //把每一行的索引放进row
                row.index = row.rowIndex
            },
            headStyle({ row, rowIndex }){
                return "table_head_style";
            },
            index_formatter:function(row, column ,cellValue,index) {
                //放回索引值
                return (this.pageSize * (this.page - 1)  + 1+ index);
            },
            formatDate: function(row,column,cellValue, index){
                return !!cellValue?utilFormatDate(new Date(cellValue), 'yyyy-MM-dd'):'';
            },
            formatDateTime: function(row,column,cellValue, index){
                return !!cellValue?utilFormatDate(new Date(cellValue), 'yyyy-MM-dd hh:mm:ss'):'';
            },
            handleCurrentChange(val) {
                this.page = val;
                this.getCommunityBuildings();
            },
            handleUnitCurrentChange(val) {
                this.unitpage = val;
                this.getBuildingUnit();
            },
            handleHouseCurrentChange(val) {
                this.housepage = val;
                this.getUnitHouse();
            },
            handleSizeChange(val) {
                this.pageSize = val;
                this.page = 1;
                this.getCommunityBuildings();
            },
            handleUnitSizeChange(val) {
                this.unitpageSize = val;
                this.unitpage = 1;
                this.getBuildingUnit();
            },
            handleHouseSizeChange(val) {
                this.housepageSize = val;
                this.housepage = 1;
                this.getUnitHouse();
            },
            resetForm(formName) {
                this.filters= {
                    buildingName:'',
                    buildingType:'',
                }
            },
            resetUnitForm(formName) {
                this.unitFilters= {
                    unitName:''
                }
            },
            resetHouseForm(formName) {
                this.houseFilters= {
                    houseName:''
                }
            },
			//获取用户列表
            getCommunityBuildings() {
                //获取当前树节点选中小区
				var communityId = this.$refs.tree.getCurrentKey();
                let para = {
                    params: {
                        page: this.page,
                        limit: this.pageSize,
                        //排序
                        orderByField:this.sort.sort,
                        isAsc:this.sort.order,
                        buildingName:this.filters.buildingName,
                        buildingType:this.filters.buildingType,
                        communityId:communityId
                    }
                };
                this.listLoading = true;
                this.$http.get(this.url.list,para).then((res) => {
                    this.total = res.data.total;
                var datas=res.data.records;
                this.communityBuildings = datas;
                this.listLoading = false;
                this.reloadCurrentTreeData();
            });
            },
			//删除
            handleDel: function (index, row) {
                this.$confirm('确认删除该记录吗?', '提示', {
                    type: 'warning'
                }).then(() => {
                    this.listLoading = true;
                let para = { id: row.id };
                this.$http.post(this.url.del,para,{emulateJSON: true}).then((res) => {
                    this.listLoading = false;
                this.$message({
                    message: '删除成功',
                    type: 'success',
                    duration:1500
                });
                this.getCommunityBuildings();
            });
            }).catch(() => {

                });
            },
			//显示编辑界面
            handleEdit: function (index, row) {
                this.editFormVisible = true;
                this.addForm = Object.assign({}, row);
                this.formFile={
                };
            },
			//显示新增界面
            handleAdd: function () {
                this.addFormVisible = true;
                this.addForm = {
                    communityId:this.$refs.tree.getCurrentKey()
                };
                this.formFile={
                };
            },
			//编辑
            editSubmit: function () {
                this.$refs.addForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认提交吗？', '提示', {}).then(() => {
                            this.editLoading = true;
                        let para = Object.assign({}, this.addForm);
                        para.completeDate = !para.completeDate ? '' : utilFormatDate(new Date(para.completeDate), 'yyyy-MM-dd');
                        para.createDate = !para.createDate ? '' : utilFormatDate(new Date(para.createDate), 'yyyy-MM-dd');
                        para.updateDate = !para.updateDate ? '' : utilFormatDate(new Date(para.updateDate), 'yyyy-MM-dd');
                        this.$http.post(this.url.edit,para).then((res) => {
                            this.editLoading = false;
                        this.$message({
                            message: '提交成功',
                            type: 'success',
                            duration:1500
                        });
                        this.$refs['addForm'].resetFields();
                        this.editFormVisible = false;
                        this.getCommunityBuildings();
                    });
                    });
                    }
                });
            },
			//新增
            addSubmit: function () {
                this.$refs.addForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认提交吗？', '提示', {}).then(() => {
                            this.addLoading = true;
                        let communityBuilding = Object.assign({}, this.addForm);

                            communityBuilding.completeDate = !communityBuilding.completeDate ? '' : utilFormatDate(new Date(communityBuilding.completeDate), 'yyyy-MM-dd');
                            communityBuilding.createDate = !communityBuilding.createDate ? '' : utilFormatDate(new Date(communityBuilding.createDate), 'yyyy-MM-dd');
                            communityBuilding.updateDate = !communityBuilding.updateDate ? '' : utilFormatDate(new Date(communityBuilding.updateDate), 'yyyy-MM-dd');

                        this.$http.post(this.url.save,communityBuilding).then((res) => {
                            this.addLoading = false;
                        this.$message({
                            message: '提交成功',
                            type: 'success',
                            duration:1500
                        });
                        this.$refs['addForm'].resetFields();
                        this.addFormVisible = false;
                        this.getCommunityBuildings();
                    });
                    });
                    }
                });
            },
            selsChange: function (sels) {
                this.sels = sels;
            },
            selsChangeUnit: function (sels) {
                this.unitSels = sels;
            },
            selsChangeHouse: function (sels) {
                this.houseSels = sels;
            },
			//模板下载
            templeteDown:function(){
                location.href = "templates/building.xls";
			},
            //模板上传
            templeteUp:function(){
                this.fileList=[];
                this.uploadParams={communityId:this.$refs.tree.getCurrentKey()};
                this.importFormVisible = true;
            },
            submitUpload() {
                this.$refs.upload.submit();
            },
            handleRemove(file, fileList) {
                console.log(file, fileList);
            },
            handlePreview(file) {
                console.log(file);
            },
			handleSuccess(response, file, fileList){
                if(!response.success){
                    this.$message.error(response.msg);
				}else{
                    this.$message({
                        message: response.msg,
                        type: 'success',
                        duration:1500
                    });
				}
                this.fileList=[];
                this.importFormVisible = false;
                //刷新列表
                this.getCommunityBuildings();
			},
            beforeAvatarUpload(file) {
                const isXls = file.type === 'application/vnd.ms-excel';
                const isXlsx = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
                if (!isXls&&!isXlsx) {
                    this.$message.error('格式不正确!');
                }

                return isXls||isXlsx;
            },
            templeteDownHouse(){
                location.href = "templates/house.xls";
            },
            templeteUpHouse(){
                this.fileListHouse=[];
                var data = this.$refs.tree.getCurrentNode();
                var node = this.$refs.tree.getNode(data.id);
                if(node.level==2){
                    this.uploadParamsHouse={buildingId:this.$refs.tree.getCurrentKey()};
                }else{
                    this.uploadParamsHouse={unitId:this.$refs.tree.getCurrentKey()};
                }

                this.importHouseFormVisible = true;
            },
            submitUploadHouse() {
                this.$refs.houseUpload.submit();
            },
            handleRemoveHouse(file, fileList) {
                console.log(file, fileList);
            },
            handlePreviewHouse(file) {
                console.log(file);
            },
            handleSuccessHouse(response, file, fileList){
                if(!response.success){
                    this.$message.error(response.msg);
                }else{
                    this.$message({
                        message: response.msg,
                        type: 'success',
                        duration:1500
                    });
                }
                this.fileListHouse=[];
                this.importHouseFormVisible = false;
                //刷新列表
                this.getUnitHouse();
            },
			//批量删除
            batchRemove: function () {
                var ids = this.sels.map(item => item.id).toString();
                this.$confirm('确认删除选中记录吗？', '提示', {
                    type: 'warning'
                }).then(() => {
                    this.listLoading = true;
                let para = { ids: ids };
                this.$http.post(this.url.batchDel,para,{emulateJSON: true}).then((res) => {
                    this.listLoading = false;
                this.$message({
                    message: '删除成功',
                    type: 'success',
                    duration:1500
                });
                this.getCommunityBuildings();
            });
            }).catch(() => {
                });
            },
            //批量删除单元
            batchRemoveUnit: function () {
                var ids = this.unitSels.map(item => item.id).toString();
                this.$confirm('确认删除选中记录吗？', '提示', {
                    type: 'warning'
                }).then(() => {
                    this.listunitLoading = true;
                    let para = { ids: ids };
                    this.$http.post(this.url.unitBatchDel,para,{emulateJSON: true}).then((res) => {
                        this.listunitLoading = false;
                        this.$message({
                            message: '删除成功',
                            type: 'success',
                            duration:1500
                        });
                        this.getBuildingUnit();
                    });
                }).catch(() => {
                });
            },
			//初始化数据字典
            initDictsData:function(){
                this.$http.get("dict/type/log_type").then((res) => {
                    if(res.ok){
                        this.propertyRightOptions = res.body;
					}
                });
            },
            defaultSelectTreeNode() {

                setTimeout(() => {
                    this.$refs.tree.setCurrentKey(defaultNode);
                    this.getCommunityBuildings();
                }, 200);
            },
			reloadCurrentTreeData(){
                var data = this.$refs.tree.getCurrentNode();
                var node = this.$refs.tree.getNode(data.id);
                if (node.level === 0) {
                    this.$http.get("common?getCommunitysByCurrentUser").then((res) => {
                        if(res.ok){
                            this.$refs.tree.updateKeyChildren(node.key,res.body);
                        }
                    });

                }else if(node.level === 1){
                    //点击小区节点，加载该小区下的楼宇信息
                    this.$http.get("communityBuilding/getCommunityBuildings/"+node.key).then((res) => {
                        if(res.ok){
                            this.$refs.tree.updateKeyChildren(node.key,res.body);
                        }
                    });
                }else if(node.level === 2){
                    //点击小区节点，加载该楼宇下的单元信息
                    this.$http.get("communityBuilding/getBuildingUnits/"+node.key).then((res) => {
                        if(res.ok){
                            this.$refs.tree.updateKeyChildren(node.key,res.body);
                        }
                    });
                }
			},
            //初始化树
            loadChildrenNode(node, resolve) {
                if (node.level === 0) {
                    this.$http.get("common?getCommunitysByCurrentUser").then((res) => {
                        if(res.ok){
                            defaultNode = res.body[0].id;

                            return resolve(res.body);

                        }
                    });

                }else if(node.level === 1){
                    //点击小区节点，加载该小区下的楼宇信息
                    this.$http.get("communityBuilding/getCommunityBuildings/"+node.key).then((res) => {
                        if(res.ok){
                            return resolve(res.body);
                        }
                    });
				}else if(node.level === 2){
                    //点击小区节点，加载该楼宇下的单元信息
                    this.$http.get("communityBuilding/getBuildingUnits/"+node.key).then((res) => {
                        if(res.ok){
                            return resolve(res.body);
                        }
                    });
                }else{
                    return resolve([]);
                }

            },
            handleNodeClick(data,node) {
                var level = node.level;
                if(level==1){
                    $("#building_div").show();
                    $("#house_div").hide();
                    $("#unit_div").hide();
                    this.getCommunityBuildings();
                }else if(level==2){
                    var existUnit = data.existUnit;
                    if(existUnit=="1"){//楼宇存在单元
                        $("#building_div").hide();
                        $("#unit_div").show();
                        $("#house_div").hide();
                        resizeUnitGrid("unit");
                        this.getBuildingUnit();
                    }else{
                        $("#building_div").hide();
                        $("#unit_div").hide();
                        $("#house_div").show();
                        resizeUnitGrid("house");
                        this.getUnitHouse();
                    }

                }else{
                    $("#building_div").hide();
                    $("#unit_div").hide();
                    $("#house_div").show();
                    resizeUnitGrid("house");
                    this.getUnitHouse();
                }

            },
			//树相关方法结束
            initDictByCode:function(code,_this,dictOptionsName){
                if(!code || !_this[dictOptionsName] || _this[dictOptionsName].length>0)
                    return;
                this.$http.get(this.url.queryDict,{params: {typeGroupName:code}}).then((res) => {
                    var data=res.data;
                if(data.success){
                    _this[dictOptionsName] = data.obj;
                    _this[dictOptionsName].splice(0, 1);//去掉请选择
                }
            });
            },
            //单元相关方法
            //删除
            handleDelUnit: function (index, row) {
                this.$confirm('确认删除该记录吗?', '提示', {
                    type: 'warning'
                }).then(() => {
                    this.listunitLoading = true;
                    let para = { id: row.id };
                    this.$http.post(this.url.unitDel,para,{emulateJSON: true}).then((res) => {
                        this.listunitLoading = false;
                        this.$message({
                            message: '删除成功',
                            type: 'success',
                            duration:1500
                        });
                        this.getBuildingUnit();
                    });
                }).catch(() => {

                });
            },
            //显示编辑界面
            handleEditUnit: function (index, row) {
                this.editUnitFormVisible = true;
                this.editUnitForm = Object.assign({}, row);
            },
            //显示新增界面
            handleAddUnit: function () {
                this.addUnitFormVisible = true;
                this.addUnitForm = {
                    buildingId:this.$refs.tree.getCurrentKey()
                };
            },
            //编辑
            editUnitSubmit: function () {
                this.$refs.editUnitForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认提交吗？', '提示', {}).then(() => {
                            this.editUnitLoading = true;
                            let para = Object.assign({}, this.editUnitForm);
                            this.$http.post(this.url.unitEdit,para).then((res) => {
                                this.editUnitLoading = false;
                                this.$message({
                                    message: '提交成功',
                                    type: 'success',
                                    duration:1500
                                });
                                this.$refs['editUnitForm'].resetFields();
                                this.editUnitFormVisible = false;
                                this.getBuildingUnit();
                            });
                        });
                    }
                });
            },
            //新增
            addUnitSubmit: function () {
                this.$refs.addUnitForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认提交吗？', '提示', {}).then(() => {
                            this.addUnitLoading = true;
                            let param = Object.assign({}, this.addUnitForm);
                            this.$http.post(this.url.unitSave,param).then((res) => {
                                this.addUnitLoading = false;
                                this.$message({
                                    message: '提交成功',
                                    type: 'success',
                                    duration:1500
                                });
                                this.$refs['addUnitForm'].resetFields();
                                this.addUnitFormVisible = false;
                                this.getBuildingUnit();
                            });
                        });
                    }
                });
            },
            //批量删除单元
            batchRemoveHouse: function () {
                var ids = this.houseSels.map(item => item.id).toString();
                this.$confirm('确认删除选中记录吗？', '提示', {
                    type: 'warning'
                }).then(() => {
                    this.listhouseLoading = true;
                    let para = { ids: ids };
                    this.$http.post(this.url.houseBatchDel,para,{emulateJSON: true}).then((res) => {
                        this.listhouseLoading = false;
                        this.$message({
                            message: '删除成功',
                            type: 'success',
                            duration:1500
                        });
                        this.getUnitHouse();
                    });
                }).catch(() => {
                });
            },
            //获取单元列表数据
            getBuildingUnit() {
                //获取当前树节点选中小区
                var buildingId = this.$refs.tree.getCurrentKey();
                let para = {
                    params: {
                        page: this.unitpage,
                        limit: this.unitpageSize,
                        //排序
                        orderByField:this.unitsort.sort,
                        isAsc:this.unitsort.order,
                        unitName:this.unitFilters.unitName,
                        buildingId:buildingId
                    }
                };
                this.listunitLoading = true;
                this.$http.get(this.url.unitList,para).then((res) => {
                    this.unittotal = res.data.total;
                    var datas=res.data.records;
                    this.buildingUnitDatas = datas;
                    this.listunitLoading = false;
                    this.reloadCurrentTreeData();
                });
            },

            //房屋相关方法
            //删除
            handleDelHouse: function (index, row) {
                this.$confirm('确认删除该记录吗?', '提示', {
                    type: 'warning'
                }).then(() => {
                    this.listhouseLoading = true;
                    let para = { id: row.id };
                    this.$http.post(this.url.houseDel,para,{emulateJSON: true}).then((res) => {
                        this.listhouseLoading = false;
                        this.$message({
                            message: '删除成功',
                            type: 'success',
                            duration:1500
                        });
                        this.getUnitHouse();
                    });
                }).catch(() => {

                });
            },
            //显示编辑界面
            handleEditHouse: function (index, row) {
                this.editHouseFormVisible = true;
                this.editHouseForm = Object.assign({}, row);
            },
            //显示新增界面
            handleAddHouse: function () {
                this.addHouseFormVisible = true;
                var data = this.$refs.tree.getCurrentNode();
                var node = this.$refs.tree.getNode(data.id);
                if(node.level==2){
                    this.addHouseForm = {
                        buildingId:this.$refs.tree.getCurrentKey()
                    };
                }else{
                    this.addHouseForm = {
                        unitId:this.$refs.tree.getCurrentKey()
                    };
                }

            },
            //编辑
            editHouseSubmit: function () {
                this.$refs.editHouseForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认提交吗？', '提示', {}).then(() => {
                            this.editHouseLoading = true;
                            let para = Object.assign({}, this.editHouseForm);
                            this.$http.post(this.url.houseEdit,para).then((res) => {
                                this.editHouseLoading = false;
                                this.$message({
                                    message: '提交成功',
                                    type: 'success',
                                    duration:1500
                                });
                                this.$refs['editHouseForm'].resetFields();
                                this.editHouseFormVisible = false;
                                this.getUnitHouse();
                            });
                        });
                    }
                });
            },
            //新增
            addHouseSubmit: function () {
                this.$refs.addHouseForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认提交吗？', '提示', {}).then(() => {
                            this.addHouseLoading = true;
                            let param = Object.assign({}, this.addHouseForm);
                            this.$http.post(this.url.houseSave,param).then((res) => {
                                this.addHouseLoading = false;
                                this.$message({
                                    message: '提交成功',
                                    type: 'success',
                                    duration:1500
                                });
                                this.$refs['addHouseForm'].resetFields();
                                this.addHouseFormVisible = false;
                                this.getUnitHouse();
                            });
                        });
                    }
                });
            },
            getUnitHouse(){
                //获取当前树节点选中单元
                var data = this.$refs.tree.getCurrentNode();
                let para = {
                    params: {
                        page: this.housepage,
                        limit: this.housepageSize,
                        //排序
                        orderByField:this.housesort.sort,
                        isAsc:this.housesort.order,
                        houseName:this.houseFilters.houseName,
                        unitId:data.id,
                        existUnit:data.existUnit
                    }
                };
                this.listhouseLoading = true;
                this.$http.get(this.url.houseList,para).then((res) => {
                    this.housetotal = res.data.total;
                    var datas=res.data.records;
                    this.unitHouseDatas = datas;
                    this.listhouseLoading = false;
                });
            }
        },
        mounted() {
            //加载楼房树
            this.initDictsData();
            this.$nextTick(function () {
                this.defaultSelectTreeNode();
            })
        }
    });

    function utilFormatDate(date, pattern) {
        pattern = pattern || "yyyy-MM-dd";
        return pattern.replace(/([yMdhsm])(\1*)/g, function ($0) {
            switch ($0.charAt(0)) {
                case 'y': return padding(date.getFullYear(), $0.length);
                case 'M': return padding(date.getMonth() + 1, $0.length);
                case 'd': return padding(date.getDate(), $0.length);
                case 'w': return date.getDay() + 1;
                case 'h': return padding(date.getHours(), $0.length);
                case 'm': return padding(date.getMinutes(), $0.length);
                case 's': return padding(date.getSeconds(), $0.length);
            }
        });
    };
    function padding(s, len) {
        var len = len - (s + '').length;
        for (var i = 0; i < len; i++) { s = '0' + s; }
        return s;
    };
    $(function () {
        autodivheight();
    });
    function resizeUnitGrid(flag) {

        // //获取浏览器窗口高度
        var winHeight=0;
        if (window.innerHeight)
            winHeight = window.innerHeight;
        else if ((document.body) && (document.body.clientHeight))
            winHeight = document.body.clientHeight;
        if("unit"==flag){
            var searchHeightUnit = $("#searchColums_unit").height();
            var toolbarHeightUnit = $("#toolbar_unit").height();
            var pageDivHeightUnit = $("#unitpageDiv").height();
            $("#unitDataGrid").height(winHeight-searchHeightUnit-toolbarHeightUnit-pageDivHeightUnit-40);
        }else{
            var searchHeightUnit = $("#searchColums_house").height();
            var toolbarHeightUnit = $("#toolbar_house").height();
            var pageDivHeightUnit = $("#housepageDiv").height();
            $("#houseDataGrid").height(winHeight-searchHeightUnit-toolbarHeightUnit-pageDivHeightUnit-40);
        }

    }
    window.onresize=autodivheight; //浏览器窗口发生变化时同时变化表格高度
    window.onresize=resizeUnitGrid; //浏览器窗口发生变化时同时变化表格高度

</script>
</html>